<template>
<div id="app" v-loading="loading">
    <router-view></router-view>
</div>
</template>

<script>
import { mapGetters, mapMutations } from 'vuex'

export default {
    name: 'App',
    data () {
        return {
            loading: false
        }
    },
    computed: {
        ...mapGetters(['contractAddress'])
    },
    mounted () {
        this.load()
    },
    methods: {
        ...mapMutations(['setInstence', 'setMethods']),
        load () {
            this.loading = true
            setTimeout(() => {
                this.loading = false
                if (window.tronWeb) {
                    this.getInstence()
                } else {
                    this.$message.error('网络不佳，请刷新再试')
                }
            }, 1000)
        },
        async getInstence () {
            const methods = {}
            const instance = await window.tronWeb.contract().at(this.contractAddress)
            this.setMethods(methods)
            this.setInstence(instance)
        }
    }
}
</script>

<style lang='less'>
#app {
    font-family: Avenir, Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #2c3e50;
    font-size: 14px;
    height: 100%;
    width: 100%;

    >div {
        height: 100%;
        width: 100%;
        overflow: hidden;

        >div {
            height: 100%;
            width: 100%;
            overflow: hidden;
        }
    }
}
</style>
